<script setup>
import {useSys} from '@/hooks/useSys'

const { safeArea } = useSys()

const props = defineProps({
  backgroundColor: {
    type: String,
    default: '#fff'
  },
  styles: {
    type: Object,
    default: () => ({})
  }
})
</script>
<template>
  <view class="footer-x-container" :style="{ paddingBottom: `${safeArea.bottom + 10}px`, backgroundColor: props.backgroundColor, ...props.styles }">
    <slot></slot>
  </view>
</template>

<style scoped lang="scss">
.footer-x-container {}
</style>
